import React from 'react'
import { BackTop, Tooltip } from 'antd'
import { ToTopOutlined } from '@ant-design/icons'

const style = {
  height: 40,
  width: 40,
  lineHeight: '40px',
  borderRadius: 4,
  backgroundColor: '#5582F3',
  color: '#fff',
  textAlign: 'center',
  fontSize: 24,
};

function MyBackTop() {
  return (
    <Tooltip placement="left" title={'回到顶部'}>
      {/* duration	回到顶部所需时间（ms）	number	450	4.4.0
          target	设置需要监听其滚动事件的元素，值为一个返回对应 DOM 元素的函数	() => HTMLElement	() => window	
          visibilityHeight	滚动高度达到此参数值才出现 BackTop	number	400	
          onClick	点击按钮的回调函数	function	-	 */}
      <BackTop>
        <div style={style}><ToTopOutlined /></div>
      </BackTop>
    </Tooltip>

  )
}

export default MyBackTop
